<template>
	<view>
	
		<view class="uni_extra"></view>

		<view class="uni_tabbar">
			<view class="tabbar_item" v-for="(item,index) in tabbar"  :key="index" @tap="changeTab(item)"  :class="{'active': num == item.itemIndex}" >
				<view class="tabbar_icon">
					<image v-if="num == item.itemIndex" mode="aspectFit" :src="item.selectedIconPath"></image>
					<image v-else mode="aspectFit" :src="item.iconPath"></image>
				</view>
				<view class="tabbar_label" >
					{{item.text}}
				</view>
			</view>
		</view>
		
	</view>
</template>

<script>
	import {
		getOperationConfiguration
	} from '@/api/sy.js'
	export default {
		name:"w-tabbar",
		props: {
					pagePath: null,
					num:0,
				},
				data() {
					return {
						shenyeIshow: 1, //2展示   1不展示
						showPage: false,
						containerHeight: 400,
						tabbarList:[],
						tabbar: [{
								"pagePath": "/pages/index/index",
								"iconPath": "/static/home.png",
								"selectedIconPath": "/static/home_is.png",
								"text": "首页",
								 "itemIndex":0
							},
							{
								"pagePath": "/pages/wallet/wallet",
								"iconPath": "/static/wallet.png",
								"selectedIconPath": "/static/wallet_is.png",
								"text": "钱包",
								"itemIndex":1
							},
							{
								"pagePath": "/pages/my/my",
								"iconPath": "/static/my.png",
								"selectedIconPath": "/static/my_is.png",
								"text": "我的",
								"itemIndex":2
							}
						],
						tabbar2: [{
								"pagePath": "/pages/index/index",
								"iconPath": "/static/home.png",
								"selectedIconPath": "/static/home_is.png",
								"text": "首页",
								 "itemIndex":0
							},
							{
								"pagePath": "/pages/my/my",
								"iconPath": "/static/my.png",
								"selectedIconPath": "/static/my_is.png",
								"text": "我的",
								"itemIndex":2
							}
						],
					};
				},
				mounted() {
					// this.getOperationConfiguration()
					// true为判断条件，根据实际的需求替换即可
					// if (true) {
					// 	this.tabbar.splice(1, 0, {
					// 		"pagePath": "/pages/index/index",
					// 		"iconPath": "/static/home.png",
					// 		"selectedIconPath": "/static/home_active.png",
					// 		"text": "首页"
					// 	})
					// }
				},
				methods: {
					async getOperationConfiguration(){ //获取 积分运营配置
						const res = await getOperationConfiguration()
						// entranceValue = 2展示    entranceValue = 1不展示
						this.shenyeIshow = res.result.entranceValue
					},
					changeTab(item) {
						// this.getOperationConfiguration()
						let platform = uni.getSystemInfoSync().platform
						// window.location.href = item.pagePath
						// return
						if (platform == 'ios') {
							window.location.href = item.pagePath
						} else if (platform == 'android') {
							uni.reLaunch({
								url:item.pagePath
							})
						}
					},
				}
			}
		</script>
		
		<style scoped>
			.uni_extra {
				width: 100%;
				height: 100rpx;
			}
		
			.uni_tabbar {
				width: 100%;
				height: 130rpx;
				box-sizing: border-box;
				border-top: solid 1rpx #eee;
				background-color: #fff;
				box-shadow: 0px 0px 17rpx 1rpx rgba(206, 206, 206, 0.32);
				overflow: hidden;
				position: fixed;
				bottom: 0;
				z-index: 9999;
				display: flex;
				justify-content: space-between;
				align-items: center;
			}
		
			.tabbar_item {
				 width: 50%;
				 height: 108rpx;
				 display: flex;
				 flex-direction: column;
				 align-items: center;
				 justify-content: center;
				 background: #ffff;
			 	 color: #4D4D4D;
				 font-weight: 400;
				 font-size: 24rpx;
				
			}
/* 			.tabbar_icon{
				display: flex;
				align-items: center;
				justify-content: center;
			} */
			.tabbar_icon image {
				display: inline-block;
				width: 44rpx;
				height: 44rpx;
				/* margin-right: 8rpx; */
			}
		
			.active {
				color: #0B87F2;
			}
			

		</style>
		